import { FC } from 'react';
import { Typography } from 'antd';
import { QuestionParagraphPropsType, QuestionParagraphDefaultProps } from './interface';
const { Paragraph } = Typography;
const Component: FC<QuestionParagraphPropsType> = (props: QuestionParagraphPropsType) => {
  const { text = '', isCenter = false } = { ...QuestionParagraphDefaultProps, ...props };
  const textList = text.split('\n');
  return (
    <Paragraph style={{ textAlign: isCenter ? 'center' : 'start' }}>
      {/* <span dangerouslySetInnerHTML={{ __html: text.replaceAll('\n', '<br />') }}></span> */}
      {textList.map((text, index) => {
        return (
          <span key={index}>
            {index > 0 && <br />}
            {text}
          </span>
        );
      })}
    </Paragraph>
  );
};

export default Component;
